
<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">


<head>
<title>Darkside 01</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" media="screen,projection" type="text/css" href="/medias/css/main.css" />
<!--[if lte IE 6]><link rel="stylesheet" type="text/css" href="/medias/css/main-msie.css" /><![endif]-->
<link rel="stylesheet" media="screen,projection" type="text/css" href="/medias/css/scheme.css" />

<link rel="stylesheet" media="print" type="text/css" href="/medias/css/print.css" />
<link rel="stylesheet" media="print" type="text/css" href="/medias/css/login.css" />
<script type="text/javascript" src="/medias/js/jquer/jquery.min.js"></script>
<script type="text/javascript" src="/medias/js/slidinglabels.js"></script>
<script type="text/javascript" src="/medias/js/jsapi"></script>
<script type="text/javascript">google.load("jquery", "1");</script>
<script src="/medias/js/jquer/jquery-css-transform.js" type="text/javascript"></script>
<script src="/medias/js/jquer/jquery-animate-css-rotate-scale.js" type="text/javascript"></script>
<link rel="stylesheet" href="/medias/css/bubbles.css" type="text/css" media="screen" charset="utf-8" />
	<script type="text/JavaScript" src="/medias/js/rounded_corners.inc.js"></script>
	<script type="text/JavaScript">
	 
function  showlayer(layer){
  var  myLayer=document.getElementById(layer);
  if(myLayer.style.display=="none"  || myLayer.style.display==""){
  myLayer.style.display="block";
  } else { 
  myLayer.style.display="none";
  }
  }



             window.onload = function() {
	      settings = {
	          tl: { radius: 10 },
	          tr: { radius: 10 },
	          bl: { radius: 10 },
	          br: { radius: 10 },
	          antiAlias: true,
	          autoPad: true
	      }
	      var myBoxObject = new curvyCorners(settings, "rounded");
	      myBoxObject.applyCornersToAll();
	  }


 
	</script>
</head>

<body>

<div id="main">
{% include "cl.html" %}
  <div id="header">

    <h1 id="logo"><a href="/"> <span>Game</span>gospeak.ru</a></h1>
    <hr class="noscreen" />
    <div id="slogan">Играй с нами</div>
    <hr class="noscreen" />
    <p class="noscreen noprint"><em>Quick links: <a href="#content">content</a>, <a href="#nav">navigation</a>.</em></p>
    <hr class="noscreen" />
  </div>
  <div id="nav">
    <ul class="box">

      <li id="nav-active"><a href="/">Главная</a></li>
      <li><a href="/">Новости</a></li>
      <li><a href="/">Сервера</a></li>
      <li><a href="/">Jabber-Чат</a></li>
      <li><a href="/">Видео</a></li>
      <li><a href="/">Блог</a></li>
       <li><a href="/">Файлы</a></li>
      <li><a href="/">Карта Игроков</a></li>
      {% if reg %}<li><a href="/">Выход из регистрации  </a></li>{% else  %}<li>{% include "login.html" %}</li>{% endif %}

      
      
    </ul>
  
    <hr class="noscreen" />

<script>
$('.item').hover(
                function(){
                    var $this = $(this);
                    expand($this);
                },
                function(){
                    var $this = $(this);
                    collapse($this);
                }
            );
            function expand($elem){
                var angle = 0;
                var t = setInterval(function () {
                    if(angle == 1440){
                        clearInterval(t);
                        return;
                    }
                    angle += 40;
                    $('.link',$elem).stop().animate({rotate: '+=-40deg'}, 0);
                },10);
                $elem.stop().animate({width:'268px'}, 1000)
                .find('.item_content').fadeIn(400,function(){
                    $(this).find('p').stop(true,true).fadeIn(600);
                });
            }
            function collapse($elem){
                var angle = 1440;
                var t = setInterval(function () {
                    if(angle == 0){
                        clearInterval(t);
                        return;
                    }
                    angle -= 40;
                    $('.link',$elem).stop().animate({rotate: '+=40deg'}, 0);
                },10);
                $elem.stop().animate({width:'52px'}, 1000)
                .find('.item_content').stop(true,true).fadeOut().find('p').stop(true,true).fadeOut();
            }
</script>
</div> 
     <div id="cols" class="box">
